<template>
    <div style="padding:20px 20px 20px 20px;background:#fff;">
      <el-table :data="list.slice((currentPage-1)*pagesize,currentPage*pagesize)" style="width: 100%"
      >
        <el-table-column type="expand" width="30">
          <template slot-scope="scope">
            <el-table :data="scope.row.json" style="width: 100%"
              row-key="id" border>
              <el-table-column prop="goods_id" label="商品ID" align="center"></el-table-column>
              <el-table-column prop="goods_name" label="商品名称" align="center"></el-table-column>
              <el-table-column prop="num" label="原有库存" align="center" ></el-table-column>
              <el-table-column prop="true_num" label="真实库存" align="center"></el-table-column>
              <el-table-column prop="loss_num" label="货损" align="center"></el-table-column>
            </el-table>
          </template>
        </el-table-column>
        <el-table-column prop="id" label="ID" align="center"></el-table-column>
        <el-table-column prop="addtime" label="盘点时间" align="center"></el-table-column>
      </el-table>
       <el-pagination
        class="fen"
        background
        @size-change="handleSizeChange"
        @current-change="handleCurrentChange"
        :current-page="currentPage"
        :page-size="pagesize"
        :page-sizes="[5, 10, 20, 50]"      
        layout="total, sizes, prev, pager, next, jumper"
        :total="list.length">
      </el-pagination>

    </div>
</template>
<script>
export default {
  name: 'sheetTable',
  props:['list'],
  data(){
      return {
        currentPage:1, //初始页
        pagesize:10, //每页的数据
        show_page:true,
        nowpage:1,
        maxpage:10
      }
  },
  created: function() {
    
  },
  methods: {
    handleSizeChange: function (size) {
        this.pagesize = size;
    },
    handleCurrentChange: function(currentPage){
      this.currentPage = currentPage;
    },
    changeLeft($event){
        $event.currentTarget.className="active";
    },
    removeLeft($event){
        $event.currentTarget.className ="tdclass";
    },
    load(tree, treeNode, resolve) {
      setTimeout(() => {
        resolve()
      }, 1000)
    }
  }
};
</script>
<style>
.fen{text-align:center;}
</style>